<template>
  <div>
  <div  >
    <a-breadcrumb class="container-breadcrumb">
      <a-breadcrumb-item>团队管理</a-breadcrumb-item>
      <a-breadcrumb-item>团队列表</a-breadcrumb-item>
      <a-breadcrumb-item v-if="isRouterAlive">{{team.name}}</a-breadcrumb-item>
           <span >
            <a-button type="text" @click="back2team">返回</a-button>
     </span>
    </a-breadcrumb>



    <a-layout >
      <div style="width: 20%;float:left;position: absolute;" >
            <div class="menu-demo">
              <a-menu
                :style="{ width: '250px', height: '100%' }"
                :default-open-keys="['0']"
                :default-selected-keys="['0_2']"
                show-collapse-button
                breakpoint="xl"
                @collapse=""
              >
                <a-menu-item key="0" @click="mem0">
                  <template #icon><icon-apps></icon-apps></template>
                  成员管理
                </a-menu-item>
                <a-sub-menu key="1"  title="项目管理">
                  <template #icon><icon-bug></icon-bug></template>
                  <a-menu-item @click="pro1">项目列表</a-menu-item>
                  <a-menu-item @click="jump2recycleBin">进入回收站</a-menu-item>
                </a-sub-menu>
                <a-sub-menu key="2">
                  <template #icon><icon-bulb></icon-bulb></template>
                  <template #title>文档中心</template>
                  <a-sub-menu v-for="(project,index) in projects.list" :title =project.name @click="handleclick4(project)">
                    <!-- <a-menu-item v-for="">Menu 1</a-menu-item> -->
                    <a-menu-item v-for="(doc_item,index) in doc.lists" @click="handleclick5(doc_item)">{{doc_item.title}}</a-menu-item>
<!--                    <a-menu-item >Menu 2</a-menu-item>-->
                  </a-sub-menu>
                </a-sub-menu>
              </a-menu>
            </div>
      </div>

      <div style="width: 80%;float:left;position: absolute;left:20%" v-if="key == 0" >
        <div :key="userPower">
          <a-button status="danger" @click="leaveTeam" v-if="userPower!=2 ">退出团队</a-button>
          <a-button type="outline"  @click="addMember();handleClick()" v-if="userPower == 1||userPower == 2"> + 邀请新成员</a-button>
          <a-modal v-model:visible="visible" @ok="handleOk" @cancel="handleCancel">
              <template #title>
              添加成员
              </template>
              <div>
                  <a-input-search :style="{width:'320px'}" placeholder="请输入成员邮箱" v-model="input.new_email" search-button @search="searchUser(input.new_email)"/>
              </div>
          </a-modal>
        </div>



        <div v-if="isRouterAlive2&&isRouterAlive">
          <!-- <a-table :columns="columns" :data-source="team.members">
            <template #avatar="{record}">
              <a-avatar src="{record.avatarUrl}" />
            </template>
            <template #name="{ record }">
              <a>{{ record.nickName }}</a>
            </template>
            <template #customTitle>
              <span>
                <smile-outlined />
                Name
              </span>
            </template>

            <template #action="{ member }">
              <span>
                <a  v-if="(userPower == 2||userPower == 1)&&member.userID as unknown as string!=userID">删除成员</a>
                <a-divider type="vertical" />
                <a v-if="userPower == 2||userPower == 1" @click="setAdmin(member.userID);reload()">设为管理员</a>
                 <a-divider type="vertical" />
                <a v-if="userPower == 2||userPower == 1 " @click="cancelAdmin(member.userID)">取消管理员</a>
                <a-divider type="vertical" />
              </span>
            </template>
          </a-table>


          <a-table :columns="columns" :data="team.members" > -->

          <!-- </a-table> -->

          <a-list  >
            <a-col v-for="member in team.members" :key="member.userID" >
            <a-list-item >

              <a-list-item-meta :title=member.nikeName>
                <template #avatar>
                  <a-avatar shape="square">
                    <img alt="avatar" :src=member.avatarUrl />
                  </a-avatar>
                </template>

                <template #description>
                  电子邮箱：{{member.email}}&emsp;&emsp;真实姓名：{{member.realName}} &emsp;&emsp;&emsp;&emsp;&emsp;所在城市：{{member.city}}
                </template>

              </a-list-item-meta>

              <span style="position:relative;left:70%;top:-30px">
                <icon-user />
                <span v-if="member.userRole == 1">
                管理员
                <a-button type="primary" size="mini" v-if="userPower == 2||userPower == 1" @click="cancelAdmin(member.userID)">取消管理员</a-button>
                <a-button status="danger" size="mini" @click="deleteMember(member.userID)" v-if="(userPower == 2||userPower == 1)&&member.userID as unknown as string!=userID">删除成员</a-button>
                </span>
                <span v-else-if="member.userRole == 2">
                创建者
                </span>
                <span v-else>
                成员
                    <a-button type="primary" size="mini" v-if="userPower == 2||userPower == 1" @click="setAdmin(member.userID);reload()">设为管理员</a-button>
                    <a-button status="danger" size="mini" @click="deleteMember(member.userID)" v-if="(userPower == 2||userPower == 1)&&member.userID as unknown as string!=userID">删除成员</a-button>
                </span>
              </span>


            <a-divider></a-divider>
            </a-list-item>

          </a-col>
          </a-list>

        </div>
      </div>

      <div style="width:80%;float:right;position: absolute;left:20%" v-if="key == 1">
        <span style="height:32px">
        <a-button type="primary" style="float:right" @click="jump2recycleBin">查看回收站</a-button>
        <a-button type="outline" style="float:right" @click="handleClick2();reload()"> + 创建新项目</a-button>
        <a-select v-model="sort_way" :style="{width:'120px'}" placeholder="请选择排序依据" :input-value-change="getProjects()">
          <a-option v-for="item of selection" :value="item.value" :label="item.label" />
        </a-select>
        <a-button type="outline"  @click="reload()">刷新</a-button>
        <a-input-search v-model="input.search_name" :style="{width:'220px'}" style="float:right" placeholder="查找项目" search-button @click="searchProject(input.search_name)"/>
        </span>


        <a-modal v-model:visible="visible2" @ok="handleOk2" @cancel="handleCancel">
          <template #title>
            项目信息
          </template>
          <div>
            项目名称：<a-input v-model="input.projectName" placeholder="请输入项目名称" size="small" allow-clear/>
            项目描述：
            <a-textarea v-model = "input.description" placeholder="请输入项目描述，不得超过20字" :max-length="20" allow-clear show-word-limit />
            请选择截止日期：<a-date-picker v-model="input.date" style="width: 200px;" />
          </div>
        </a-modal>



          <!-- <a-list >
            <a-col  v-for="project in projects.list" :key="project.teamID" >
            <a-list-item v-if="project.isDelete == 0">
              <a-list-item-meta :title=project.name
                                :description=project.description
              >


              </a-list-item-meta>


              <div></div>
              <div>
                <a-button type="outline" @click="jump2project(project.id)">进入项目</a-button>
                <a-button status="danger" @click="deleteProject(project.id)">移入回收站</a-button>
                <a-button type="outline" @click="handleClick3">修改项目</a-button>
                <a-button type="outline" @click="copyProject(project.id)">创建项目副本</a-button>

                <a-modal v-model:visible="visible3" @ok="handleOk3;renameProject(project.id);" @cancel="handleCancel">
                  <template #title>
                    修改项目名称 </template>
                  <a-input v-model="input.newName" placeholder="请输入项目新名称" size="small" allow-clear/>

                  <div>

                  </div>
                </a-modal>
              </div>
            </a-list-item>
          </a-col>
          </a-list> -->
      <a-space/>
      <div style="width:100%;float:right" v-if="isRouterAlive">
          <a-table :columns="columns2" :data="projects.list" stripe>
          <template #NAME = "{record}" :cell-click="Message.info('666')">
              <a-tooltip content="点击进入" position="top" mini>
                <span @click="jump2project(record.id, record.name)" style="color:DodgerBlue;">
                {{record.name}}
                </span>
            </a-tooltip>
          </template>
           <template #optional="{ record }">
              <a-tooltip content="移入回收站" position="top" mini>
                <icon-delete size=30 @click="deleteProject(record.id)" />
              </a-tooltip>
              <a-tooltip content="修改项目" position="top" mini>
                <icon-edit size=30 @click="handleClick3"/>
              </a-tooltip>
              <a-tooltip content="创建副本" position="top" mini>
                <icon-copy size=30 @click="copyProject(record.id)" />
              </a-tooltip>

                   <a-modal v-model:visible="visible3" @ok="handleOk3;renameProject(record.id)" @cancel="handleCancel">
                  <template #title>
                    修改项目名称 </template>
                  <a-input v-model="input.newName" placeholder="请输入项目新名称" size="small" allow-clear/>

                  <div>

                  </div>
                </a-modal>
            </template>
          </a-table>
        </div>
        </div>


      <div style="width:80%;float:right;position: absolute;left:20%" v-if="key == 2">
          <recycleBin/>
      </div>
  </a-layout>

  </div>
  </div>
</template>

<script   lang="ts" setup>
import { useRouter } from 'vue-router';
import { setup } from 'mockjs';
import { createApp, inject, nextTick, onBeforeMount, onMounted, onUpdated, provide, reactive, ref } from 'vue'
import ArcoVue, { Message, TableColumnData } from '@arco-design/web-vue';
import { SmileOutlined, DownOutlined } from '@ant-design/icons-vue';
import { defineComponent } from 'vue';
import '@arco-design/web-vue/dist/arco.css';
import recycleBin from './recycleBin.vue'
import axios from "axios";
import {removeMyInterceptor} from "@/api/interceptor";
import M from 'minimatch';
const router = useRouter();

const input = reactive({new_email:'',projectName:'',date:'',newName:'',search_name:'',description:''});
const sort_way = ref();
const key = ref(0);
const userPower = ref(0);
const show = ref(true);
const visible = ref(false);
const visible2 = ref(false);
const visible3 = ref(false);
    // const value = ref();
// const change = ()=>{
//   if(userPower == 0) userPower = 2;
//   else userPower = 0;
//   reload3();
//   console.log(userPower)
// }
    const columns: TableColumnData[] = [
    //   {
    //   dataIndex: 'avatarUrl',
    //   title:'头像',
    //   // key: 'name',
    //   // slots: { title: 'customTitle', customRender: 'name' },
    // },
    {
      dataIndex: 'nickName',
      title:'昵称',
      // key: 'name',
      // slots: { title: 'customTitle', customRender: 'name' },
    },
    {
      title: '真实姓名',
      dataIndex: 'realName',
      // key: 'age',
    },
    {
      title: '电子邮箱',
      dataIndex: 'email',
      // key: 'address',
    },
    {
      title: '所在城市',
      // key: 'tags',
      dataIndex: 'city',
      // slots: { customRender: 'tags' },
    },
    {
      title: '操作',
      // key: 'action',
      // slots: { customRender: 'action' },
    },
  ]

  const columns2: TableColumnData[] = [

    {
      dataIndex: 'name',
      title:'项目名称',
      slotName:'NAME',
      // key: 'name',
      // slots: { title: 'customTitle', customRender: 'name' },
    },
    {
      title: '截止日期',
      dataIndex: 'deadline',
      // key: 'age',
    },
    {
      title: '描述',
      dataIndex: 'description',
      // key: 'address',
    },
    {
      title: '操作',
      slotName: 'optional'
    }
  ]

    const selection = [{
      value: 0,
      label: '创建时间',
      other: 'extra'
    }, {
      value: 1,
      label: '截止时间',
      other: 'extra'
    }, {
      value: 2,
      label: '更新时间',
      other: 'extra'
    }, {
      value: 3,
      label: '项目名称',
      other: 'extra'
    }]

  // const { loading, setLoading } = useLoading(isLoading);
  // const { loading2, setLoading2 } = useLoading2(isLoading2);
let flag1 = true;
let flag2 = true;
  const ID = window.localStorage.getItem('teamID');
  const userID = window.localStorage.getItem('id');

const mem0 = ()=>{
  // Message.info(key.value as unknown as string);
  console.log(key)
  key.value = 0;
  // Message.info(key.value as unknown as string);
  console.log(key)
  reload();
}

const pro1 = () => {
  key.value = 1;
  reload();
}
const handleClick = () => {
  visible.value = true;
};
const handleClick2 = () => {
  visible2.value = true;
};
const handleClick3 = () => {
  visible3.value = true;
};
const handleclick4 = (project:any )=>{
  console.log('小框被点击了'+project);
  console.log(project);
  console.log(project);
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'document/viewDocList',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      projectID:project.id
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功拿到项目文档');
      console.log(response.data);
      doc.lists=response.data.data;
      console.log(doc.lists);
      // console.log('成功');
    } else {
      console.log('邀请失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });
}
const handleclick5 = (item:any )=>{
  console.log(item);
  localStorage.setItem("teamID",item.teamID as unknown as string);
  localStorage.setItem("projectID",item.projectID as unknown as string);
  localStorage.setItem("fromWhere",item.id as unknown as string);   // 判断是文档是否文档中心进入
  // console.log(ID)
  // console.log(id)
  router.push({
    name: 'project',
  });
}
const handleOk = () => {
  visible.value = false;
  //todo:将新成员加入团队中
  let email = input.new_email;
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/inviteMember',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID,
      email:email
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功邀请成员');
       setTimeout(function() { reload(); }, 6000);  //5秒后将会调用执行remind()函数
      reload();
      Message.success('邀请成功')
      // console.log('成功');
    } else {
      // console.log(response.message)
      console.log('邀请失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });
};
const handleOk2 = () => {
  visible2.value = false;
  //todo:将新项目加入团队中，新项目信息保存在input.projectName和input.date
  let id = localStorage.getItem("id");
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/createProject',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      adminID:userID,
      teamID:ID,
      projectName:input.projectName,
      description:input.description,
      deadline:input.date
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      // loadingme.value = true;
      console.log('成功创建项目');

    } else {
      console.log('创建项目失败');
      console.log(response)
      console.log(userID)
      console.log(ID)
      console.log(input.projectName)
      console.log(input.date)
    }
  }).catch(function () {
    console.log('请求失败');
  });
};
const handleOk3 = () => {
  visible3.value = false;

};
const handleCancel = () => {
  visible.value = false;
  visible2.value = false;
  visible3.value = false;
}

  const isRouterAlive = ref(true);
  const isRouterAlive2 = ref(true);


    const reload = () => {
      isRouterAlive.value = false;
      nextTick(() => {
        isRouterAlive.value = true;
      });
    };
      const reload2 = () => {
      isRouterAlive2.value = false;
      nextTick(() => {
        isRouterAlive2.value = true;
      });
    };
      const reload3 = () => {
      show.value = false;
      nextTick(() => {
        show.value = true;
      });
    };
    provide("reload", reload);

let doc = reactive({
  lists:[{
    id:'',
    title:'',
    content:'',
    teamID:'',
    projectID:''
  }]
})

let team = {
  // teamID:'',
  name:'',
  members:[
    {
      userID:1,
      realName:'张三',
      email:'123@qq.com',
      avatarUrl:'https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/3ee5f13fb09879ecb5185e440cef6eb9.png~tplv-uwbnlip3yd-webp.webp',
      userRole:1,
      nikeName:'',
      // realName:'',
      city:'',
    },
  ],
};




async function getTeamMembers() :Promise<void>{
  //todo:传入团队ID，返回团队信息团队格式如上team示例
  removeMyInterceptor();
  await axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/memberList',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID
    })
  }).then(function (response) {
    // console.log('请求成功');

    // loadingme.value = true;
    if (response.data.code === 0) {
      team.members = response.data.data;
      console.log('获取成员列表成功');
      console.log(team.members)
      // reload();
    } else {
      console.log('获取成员列表失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });

  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/id2name',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log('get团队名')
      team.name = response.data.message;
      console.log('成功获取团队信息');
      console.log(team);
      if(flag1){
        reload();
        flag1 = false;
      }
    } else {
      console.log('获取团队信息失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });

}
  searchUserPower();
  console.log('888888888888888888888')
  console.log(userPower)

getTeamMembers();


let projects = {
  list:[
  {
    name:'跑步',
    id:0,
    deadline:"October 13, 2020 11:13:00",
    // avatar:'https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/3ee5f13fb09879ecb5185e440cef6eb9.png~tplv-uwbnlip3yd-webp.webp',
    description:'',
    teamID:15,
    isDelete:0,
  },]

}
async function getProjects() :Promise<void> {
  //todo:根据团队id获取项目列表，格式参照上述projects
  let sort = 2;
  if(typeof (sort_way.value) === "undefined"){
    sort = 2;
  }
  else{
    sort = sort_way.value;
  }
  console.log('------sort:'+sort);
  // loadingme.value = true;
  removeMyInterceptor();
  await axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/normalBin',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID,
      sortWay:sort,
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log(response.data.message);
      projects.list = response.data.data;
      for(var i in projects.list){
        projects.list[i].deadline = projects.list[i].deadline.slice(0,10);
      }
      console.log('加载项目列表成功');
      console.log('sort'+sort_way.value)
      console.log(projects);
      if(flag2){
         reload();
         flag2 = false;
      }


    } else {
      console.log('加载项目列表失败');
      console.log(response)
      console.log(sort_way.value)

    }
  }).catch(function () {
    console.log('请求失败');
  });

}

 getProjects();


const useremail = window.localStorage.getItem('email');
console.log('email'+useremail)
async function searchUserPower() :Promise<void>{
  console.log('searchpower')
  //todo:查询在当前团队中当前登录用户的权限级别
  // let power = 0;
  removeMyInterceptor();
  await axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/checkPower',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      userID:userID,
      teamID:ID
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功拿到权限'+response.data.data);
      userPower.value = response.data.data;
      console.log(userPower+'userpower')
      show.value = true;
      reload3();

    } else {
      console.log('取权限失败');
      console.log(response)
    }
  }).catch(function () {
    console.log('请求失败');
  });
  // console.log('power'+power)
  // return power;//仅作示例
}




const setAdmin = (id:any)=>{
//todo:将当前id成员设置为管理员，修改团队信息和用户信息并使后台同步更新
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/changePower',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      userID:id,
      teamID:ID,
      power:1
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
         Message.success('修改成功')
      console.log('成功变更权限');
      reload2();
       getTeamMembers();
       setTimeout(function() { reload(); }, 1000);  //5秒后将会调用执行remind()函数

      reload();

    } else {
      console.log('变更权限失败');
    }
      reload2();
      reload2();
      reload2();

  }).catch(function () {
    console.log('请求失败');
  });
}

const cancelAdmin = (id:any) =>{
//todo:将当前id成员设置为普通成员，修改团队信息和用户信息并使后台同步更新
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/changePower',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      userID:id,
      teamID:ID,
      power:0
    })
  }).then(function (response) {
    console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功变更权限');
      // console.log('成功');
      Message.success('取消成功')
       getTeamMembers();
       setTimeout(function() { reload(); }, 1000);  //5秒后将会调用执行remind()函数
      reload();

    } else {
      console.log('取消管理员失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });

}
const deleteMember = (this_id:any) =>{
  //todo:删除成员
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/kickMember',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID,
      userID:this_id,
    })
  }).then(function (response) {
    console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功删除成员');
      Message.success('删除成功')
       setTimeout(function() { reload(); }, 3000);  //5秒后将会调用执行remind()函数

      reload();
      reload2();
      // console.log('成功');
    } else {
      console.log('删除失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });
}
const leaveTeam = () =>{
  //todo:删除当前成员
  let email = localStorage.getItem("email");

  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/kickMember',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      teamID:ID,
      email:email
    })
  }).then(function (response) {
    console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功退出团队');
    } else {
      console.log('推出失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });
}
const addMember = () => {
  //todo:当前团队加入成员
  //感觉这个函数没用

  /* let email = input.new_email;
  removeMyInterceptor();
  axios({
    method: 'post',           /!* 指明请求方式，可以是 get 或 post *!/
    url: 'team/inviteMember',       /!* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 *!/
    data: ({      /!* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 *!/
      teamID:teamID,
      email:email
    })
  }).then(function (response) {
    console.log('请求成功');
    if (response.data.code === 0) {
      console.log('成功邀请成员');
      console.log('成功');
    } else {
      console.log('失败');
    }
  }).catch(function () {
    console.log('请求失败');
  }); */
}
const searchUser = (email:string) => {
  //todo:搜索此用户，搜索结果用弹窗表示默认权限为普通用户
  console.log(email);

  var res = true;
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'team/email2user',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      email:email
    })
  }).then(function (response) {
    console.log('请求成功');
    if (response.data.code === 0) {
      Message.success('搜索成功！');
    } else {
      Message.error('用户不存在！');
    }
  }).catch(function () {
    console.log('请求失败');
  });

}

const deleteProject = (id:number) => {
//todo:删除项目
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/deleteProject',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      projectID:id
    })
  }).then(function (response) {
    if (response.data.code === 0) {
      console.log(response.data.message);
      Message.success('删除成功！');
      reload();
    } else {
      console.log('删除失败');
    }
  }).catch(function () {
    console.log('请求失败');
  });
  reload();
}

const jump2project = (id:number , name:string) => {
  localStorage.setItem("teamID",ID as unknown as string);
  localStorage.setItem("projectID",id as unknown as string);
  localStorage.setItem("fromWhere",'777');   // 判断是文档是否文档中心进入
  localStorage.setItem("projectName", name);
  console.log(ID)
  console.log(id)
  router.push({
    name: 'project',
  });
}

const renameProject = (id:number) => {
  //todo:重命名项目
  console.log('----------');
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/renameProject',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
      nameNeo:input.newName,
      projectID:id
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log(response.data.message);
    console.log('重命名请求成功');
    reload();
    reload();
    reload();
    reload();

    } else {
      console.log('重命名失败');
      console.log(response)
    }
  }).catch(function () {
    console.log('请求失败');
  });

}

const searchProject = (name:string) => {
  let teamID = localStorage.getItem('teamID');
  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/searchProject',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
     name:name,
      teamID:teamID
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log(response.data.message);
      projects.list = response.data.data;
      console.log(projects.list);
    console.log('查找项目成功');
    reload();
    reload();
    reload();
    reload();

    } else {
      console.log('查找失败');
      console.log(response)
    }
  }).catch(function () {
    console.log('请求失败');
  });

}

const copyProject = (id:number) => {

  removeMyInterceptor();
  axios({
    method: 'post',           /* 指明请求方式，可以是 get 或 post */
    url: 'project/copyProject',       /* 指明后端 api 路径，由于在 main.js 已指定根路径，因此在此处只需写相对路由 */
    data: ({      /* 需要向后端传输的数据，此处使用 qs.stringify 将 json 数据序列化以发送后端 */
     id:id
    })
  }).then(function (response) {
    // console.log('请求成功');
    if (response.data.code === 0) {
      console.log(response.data.message);
      // projects.list = response.data.data;
      getProjects();
    console.log('复制项目成功');
    reload();
    reload();
    reload();
    reload();

    } else {
      console.log('复制失败');
      console.log(response)
    }
  }).catch(function () {
    console.log('请求失败');
  });

}

const back2team = () => {
  router.go(-1)
}

const jump2recycleBin = () => {
  /*  localStorage.setItem('teamID', ID); */
  // router.push({
  //   name: 'recycleBin',
  // });
  key.value = 2;
}
// userPower = 2;
//todo:后台数据修改后删除此行，现在默认都是创建者视角

</script>

<style scoped lang="less">
.container-breadcrumb {
  margin: 16px 0;
  :deep(.arco-breadcrumb-item) {
    color: rgb(var(--gray-6));
    &:last-child {
      color: rgb(var(--gray-8));
    }
  }
}

.menu-demo {
  // box-sizing: border-box;
  border-style:solid;
  border-color:steelblue;
  width: 253px;
  height: 600px;
  // padding: 40px;
  background-color: var(--color-neutral-2);
}
</style>
